<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="参与和分享 - 图腾社区系统 - {{title}}">
    <title>{{title}}</title>
    <link rel="stylesheet" href="/apps/css/bootstrap.min.css">
    <link rel="stylesheet" href="/apps/css/fontawesome-free-6.4.0-web/css/all.css">
    <link rel="stylesheet" href="/apps/css/mui.css">
</head>
<body>
    <header class="d-flex align-items-center bg-custom-color p-3">
        <button id="backButton" class="btn btn-primary rounded-circle me-3" style="background-color: white;" onclick="history.back();">
            <i class="fas fa-arrow-left custom-color"></i>
        </button>
        <span class="title-text text-white fs-5">{{excerpt}}</span>
    </header>
    <div class="container">
        <div class="content">
            <div class="row">
                <div class="col-12">
                    <p>{{{description}}}</p>
                    <div class="table-responsive">
                        <table class="table table-striped table-bordered">
                            <thead class="table-light">
                                <tr>
                                    {{#each fields}}
                                    <th scope="col" class="cell-content">{{this}}</th>
                                    {{/each}}
                                </tr>
                            </thead>
                            <tbody>
                                {{#each mRows}}
                                <tr data-id="{{this.id}}" onclick="showItemModal({{this.id}});">
                                    {{#each this}}
                                        <td class="cell-content" style="word-wrap: break-word; white-space: pre-wrap;">{{{this}}}</td>
                                    {{/each}}
                                </tr>
                                {{/each}}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
        <nav aria-label="Page navigation" class="pagination-container">
            <button id="homeButton" class="btn btn-primary position-absolute top-0 start-0 m-3 rounded-circle" style="width: 50px; height: 50px; padding: 0;" onclick="window.location.href='weixin://dl/business/?appid=wx1b441d1a37b278e1&path=pages/index/index&env_version=release';">
                <i class="fas fa-home" style="color:white;"></i>
            </button>
            <button id="formButton" class="btn btn-primary position-absolute top-0 end-0 m-3 rounded-circle" style="width: 50px; height: 50px; padding: 0;" onclick="showQueryForm();">
                <i class="fas fa-search" style="color: white;"></i>
            </button>
            <ul class="pagination">
                {{{paginator}}}
            </ul>
        </nav>
    </div>
    <div class="modal fade" id="queryModal" tabindex="-1" aria-labelledby="queryModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="queryModalLabel">设置统计参数</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <form id="queryForm" onsubmit="submitQueryForm()">
                    <div class="modal-body">
                        <div class="row">
                            <div class="col">
                                <div class="mb-3">
                                    <label for="begin" class="form-label">起始日期</label>
                                    <input type="date" class="form-control" id="begin" name="begin" value="{{begin}}">
                                </div>
                            </div>
                            <div class="col">
                                <div class="mb-3">
                                    <label for="end" class="form-label">结束日期</label>
                                    <input type="date" class="form-control" id="end" name="end" value="{{end}}">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-4">
                                <div class="mb-3">
                                    <label for="rating" class="form-label">评价等级</label>
                                    <select class="form-select" id="rating" name="rating">
                                        <option value="">全部等级</option>
                                        <option value="2">2-很有用</option>
                                        <option value="1">1-有作用</option>
                                        <option value="0">0-不好说</option>
                                        <option value="3">3-已治愈</option>
                                        <option value="-1">-1无作用</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-4">
                                <div class="mb-3">
                                    <label for="status" class="form-label">问卷状态</label>
                                    <select class="form-select" id="status" name="status">
                                        <option value="">全部状态</option>
                                        <option value="1">1-已提交</option>
                                        <option value="0">0-未提交</option>
                                        <option value="9">9-已截收</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-4">
                                <div class="mb-3">
                                    <label for="took" class="form-label">服用时间</label>
                                    <select class="form-select" id="took" name="took">
                                        <option value="">所有时长</option>
                                        <option value="0">未满1月</option>
                                        <option value="1">已满1月</option>
                                        <option value="3">已满3月</option>
                                        <option value="6">已满6月</option>
                                        <option value="9">已满9月</option>
                                        <option value="12">已满1年</option>
                                        <option value="18">满1年半</option>
                                        <option value="24">已满2年</option>
                                        <option value="36">3年以上</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-6">
                                <div class="mb-3">
                                    <label for="sinfo" class="form-label">答案内容</label>
                                    <input type="text" class="form-control" id="sinfo" name="sinfo" value="{{sinfo}}" placeholder="病种、评价等">
                                </div>
                            </div>
                            <div class="col">
                                <div class="mb-3">
                                    <label for="uid" class="form-label">用户UID</label>
                                    <input type="text" class="form-control" id="uid" name="uid" value="{{uid}}" placeholder="uid">
                                </div>
                            </div>
                            <div class="col">
                                <div class="mb-3">
                                    <label for="cid" class="form-label">渠道CID</label>
                                    <input type="text" class="form-control" id="cid" name="cid" value="{{cid}}" placeholder="cid">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer" id="clientModalFooter">
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭查询</button>
                            <button type="submit" class="btn btn-primary">查询数据</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <footer class="footer" style="text-align: center;">
        <div class="row">
            <div class="text-muted">&nbsp;</div>
            <div class="text-muted">&nbsp;</div>
            <div class="text-muted">&copy;2023 图腾生命医学</div>
            <div class="text-muted">我们为人类免疫事业而奉献</div>
        </div>
    </footer>
    <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
    <script src="/apps/js/bootstrap.bundle.min.js"></script>
    <script src="/apps/js/crm-hbs-utils.js"></script>
    <script src="/apps/js/wx-client-dom.js"></script>
    <script>
        function showItemModal(id) {
            const url = `https://totemlife.cn/apps/loyalty/follow-up-detail/${id}`;
            window.location.href = url;
        }
        function showQueryForm() {
            const modal = new bootstrap.Modal(document.getElementById('queryModal'));
            modal.show();
        }
        function submitQueryForm() {
            const queryParams = new URLSearchParams();
            const paramsToCheck = ['begin', 'end', 'rating', 'status', 'took', 'sinfo', 'uid', 'cid'];
            for (const param of paramsToCheck) {
                const value = document.getElementById(param).value;
                if (value && value !== '') queryParams.append(param, value);
            }
            const url = `https://totemlife.cn/apps/loyalty/follow-ups?${queryParams.toString()}`;
            window.location.href = url;
        }
    </script>
</body>
</html>
